﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Main.Master" AutoEventWireup="true" CodeBehind="Products.aspx.cs" Inherits="IMark.Products1" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
    <style>
        .tab-content img {
            width:600px;
        }
    </style>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <div class="container">
        <div class="row">
            <div class="col-md-12">
                <div class="breadcrumb"><a href="Default.aspx"><i class="fa fa-home fa-fw"></i>Home </a><i class="fa fa-angle-right fa-fw"></i><a href="Products.aspx">Sản Phẩm </a></div>

                <!-- Quick Help for tablets and large screens -->
                <div class="quick-message hidden-xs">
                    <div class="quick-box">
                        <div class="quick-slide">
                            <span class="title">Help</span>
                            <div class="quickbox slide" id="quickbox">
                                <div class="carousel-inner">
                                    <div class="item active"><a href="#"><i class="fa fa-envelope fa-fw"></i>Gửi Mail</a> </div>
                                    <div class="item"><a href="#"><i class="fa fa-question-circle fa-fw"></i>Chat Online</a> </div>
                                    <div class="item"><a href="#"><i class="fa fa-phone fa-fw"></i>(08) 666 888</a> </div>
                                </div>
                            </div>
                            <a class="left carousel-control" data-slide="prev" href="#quickbox"><i class="fa fa-angle-left fa-fw"></i></a><a class="right carousel-control" data-slide="next" href="#quickbox"><i class="fa fa-angle-right fa-fw"></i></a>
                        </div>
                    </div>
                </div>
                <!-- end: Quick Help -->

            </div>
        </div>
    </div>
    <div class="row clearfix f-space10"></div>
    <div class="container"> 
  <!-- row -->
  <div class="row">
    <div class="col-md-12 box-block"> 
      
      <!--  box content -->
      
      <div class="box-content"> 
        <!-- single product -->
        <div class="single-product"> 
          <!-- Images -->
          <div class="images col-md-6 col-sm-12 col-xs-12">
            <div class="row"> 
              <!-- Small Images -->
              <div class="thumbs col-md-3 col-sm-3 col-xs-3"  id="thumbs">
                <ul>
                  <li class=""><a href="#a" data-image="images/products/product2.jpg" data-zoom-image="images/products/product2.jpg" class="elevatezoom-gallery active" ><img src="images/products/product2.jpg" alt="small image" /></a></li>
                  <li class=""> <a href="#a" data-image="images/products/product2-1.jpg" data-zoom-image="images/products/product2-1.jpg"  class="elevatezoom-gallery" > <img src="images/products/product2-1.jpg" alt="small image" /></a></li>
                  <li class=""> <a href="#a" data-image="images/products/product2-2.jpg" data-zoom-image="images/products/product2-2.jpg" class="elevatezoom-gallery"><img src="images/products/product2-2.jpg" alt="small image" /></a></li>
                </ul>
              </div>
              <!-- end: Small Images --> 
              <!-- Big Image and Zoom -->
              <div class="big-image col-md-9 col-sm-9 col-xs-9"> <img id="product-image" src="images/products/product2.jpg" data-zoom-image="images/products/product2.jpg" alt="big image" /> </div>
              <!-- end: Big Image and Zoom --> 
            </div>
          </div>
          
          <!-- end: Images --> 
          
          <!-- product details -->
          
          <div class="product-details col-md-6 col-sm-12 col-xs-12"> 
            
            <!-- Title and rating info -->
            <div class="title">
              <h1>Ladies Stylish Handbag</h1>
              <div class="rating"> <i class="fa fa-star"></i> <i class="fa fa-star"></i> <i class="fa fa-star"></i> <i class="fa fa-star-half-o"></i> <i class="fa fa-star-o"></i> <span>Sản phẩm này có 30 lượt xem và đánh giá <a href="#wr">Nhận Xét</a></span> </div>
            </div>
            <!-- end: Title and rating info -->
            
            <div class="row"> 
              <!-- Availability, Product Code, Brand and short info -->
              <div class="short-info-wr col-md-12 col-sm-12 col-xs-12">
                <div class="short-info">
                  <div class="product-attr-text">Tình Trạng: <span class="available">Còn Hàng</span></div>
                  <div class="product-attr-text">Mã Sản Phẩm: <span>8368596003</span></div>
                  <div class="product-attr-text">Thương Hiệu: <span>Polo</span></div>
                  <p class="short-info-p"> Đầm Linen Phối Ren – Kiểu Dáng Xòe Xinh Xắn, Màu Sắc Nhã Nhặn – Style Nhẹ Nhàng Và Nữ Tính Dành Cho Bạn Gái. Giá 350.000 VNĐ, Còn 210.000 VNĐ, Giảm 40%. Chỉ Có Tại IMark Shop! </p>
                </div>
              </div>
              <!-- end: Availability, Product Code, Brand and short info --> 
              
            </div>
            <div class="row">
              <div class="short-info-opt-wr col-md-8 col-sm-8 col-xs-12">
                <div class="short-info-opt">
                  <div class="att-row">
                    <div class="qty-wr">
                      <div class="qty-text hidden-xs">Qty:</div>
                      <div class="quantity-inp">
                        <input type="text" class="quantity-input" name="p_quantity" value="1">
                      </div>
                      <div class="quantity-txt"><a href="#a" class="qty qtyminus" ><i class="fa fa-minus fa-fw"></i></a></div>
                      <div class="quantity-txt"><a href="#a" class="qty qtyplus" ><i class="fa fa-plus fa-fw"></i></a></div>
                    </div>
                    <div class="color-wr">
                      <div class="color-options">
                        <ul class="pull-left">
                          <li class="input-prepend dropdown" data-select="true"> <a class="add-on dropdown-toggle" data-hover="dropdown" data-toggle="dropdown" href="#a"> <span class="dropdown-display">Màu</span> <i class="fa fa-sort fa-fw"></i> </a> 
                            <!-- this hidden field is used to contain the selected option from the dropdown -->
                            <input class="dropdown-field" type="hidden" value="">
                            <ul class="dropdown-menu" role="menu">
                              <li><a href="#a" data-value="Black" class="border-black">Đen</a></li>
                              <li><a href="#a" data-value="Green" class="border-green">Xanh Lá</a></li>
                              <li><a href="#a" data-value="Blue" class="border-blue">Xanh Nước Biển</a></li>
                              <li><a href="#a" data-value="Orange" class="border-orange">Cam</a></li>
                            </ul>
                          </li>
                        </ul>
                      </div>
                    </div>
                    <div class="size-wr">
                      <div class="size-options">
                        <ul class="pull-left">
                          <li class="input-prepend dropdown" data-select="true"> <a class="add-on dropdown-toggle" data-hover="dropdown" data-toggle="dropdown" href="#a"> <span class="dropdown-display">Size</span> <i class="fa fa-sort fa-fw"></i> </a> 
                            <!-- this hidden field is used to contain the selected option from the dropdown -->
                            <input class="dropdown-field" type="hidden" value="">
                            <ul class="dropdown-menu" role="menu">
                              <li><a href="#a" data-value="XS">XS</a></li>
                              <li><a href="#a" data-value="S">S</a></li>
                              <li><a href="#a" data-value="M">M</a></li>
                              <li><a href="#a" data-value="N">N</a></li>
                              <li><a href="#a" data-value="L">L</a></li>
                              <li><a href="#a" data-value="XL">XL</a></li>
                              <li><a href="#a" data-value="XXL">XXL</a></li>
                            </ul>
                          </li>
                        </ul>
                      </div>
                    </div>
                  </div>
                </div>
              </div>
              <div class="short-info-share-wr col-md-4 col-sm-4 col-xs-12">
                <div class="short-info-opt"> 
                  <!-- AddThis Button BEGIN -->
                  <div class="addthis_toolbox addthis_default_style addthis_32x32_style"> <a class="addthis_button_facebook addthis-btn"></a> <a class="addthis_button_twitter addthis-btn" ></a> <a class="addthis_button_google_plusone_share addthis-btn"></a> <a class="addthis_button_compact addthis-btn"></a> </div>
                  <script type="text/javascript">
                      var addthis_config = { "data_track_addressbar": true };
</script> 
                  <script type="text/javascript" src="http://s7.addthis.com/js/300/addthis_widget.js#pubid=ra-4df5ee7405c65a76"></script> 
                  <!-- AddThis Button END --> 
                </div>
              </div>
            </div>
            <div class="row">
              <div class="price-wr col-md-4 col-sm-4 col-xs-12">
                <div class="big-price"> <span class="price-old"><span class="sym">$</span>560.50</span> <span class="price-new"><span class="sym">$</span>520.99</span> </div>
              </div>
              <div class="product-btns-wr col-md-8 col-sm-8 col-xs-12">
                <div class="product-btns">
                  <div class="product-big-btns">
                    <button class="btn btn-addtocart"> <i class="fa fa-shopping-cart fa-fw"></i> Add to Cart </button>
                    <button class="btn btn-compare" data-toggle="tooltip" title="Add to Compare"> <i class="fa fa-retweet fa-fw"></i> </button>
                    <button class="btn btn-wishlist" data-toggle="tooltip" title="Add to Wishlist"> <i class="fa fa-heart fa-fw"></i> </button>
                    <button class="btn btn-sendtofriend" data-toggle="tooltip" title="Send to Friend"> <i class="fa fa-envelope fa-fw"></i> </button>
                  </div>
                </div>
              </div>
            </div>
          </div>
          
          <!-- end: product details --> 
          
        </div>
        
        <!-- end: single product --> 
        
      </div>
      
      <!-- end: box content --> 
      
    </div>
  </div>
  <!-- end:row --> 
</div>
<!-- end: container-->

<div class="row clearfix f-space30"></div>

<!-- container -->
<div class="container"> 
  <!-- row -->
  <div class="row"> 
    <!-- tabs -->
    <div class="col-lg-9 col-md-9 col-sm-12 col-xs-12 main-column box-block product-details-tabs"> 
      
      <!-- Details Info/Reviews/Tags --> 
      <!-- Nav tabs -->
      <ul class="nav nav-tabs blog-tabs nav-justified">
        <li class="active"><a href="#details-info" data-toggle="tab"><i class="fa  fa-th-list fa-fw"></i> Details Info</a></li>
        <li><a href="#reviews" data-toggle="tab"><i class="fa fa-comments fa-fw"></i> Reviews</a></li>
        <li> <a href="#tags" data-toggle="tab"><i class="fa fa-tags fa-fw"></i> Tags </a> </li>
        <li><a href="#custom-tab" data-toggle="tab"><i class="fa fa-video-camera fa-fw"></i> Custom Tab</a></li>
      </ul>
      <!-- Tab panes -->
      <div class="tab-content">
        <div class="tab-pane active" id="details-info">
          <p style="text-align: center;"><strong>NHẸ NHÀNG VÀ QUYẾN RŨ HƠN VỚI ĐẦM LINEN PHỐI REN</strong></p>
<p style="text-align: center;">&nbsp;</p>
<p style="text-align: center;"><strong><img src="http://images.hotdeals.vn/hinhanh/HCM/75752_body_01.jpg" alt="Đầm Linen Phối Ren" width="600" height="1094"><br></strong></p>
<p><strong>&nbsp;</strong></p>
<p><strong>Thông tin sản phẩm:</strong></p>
<p>- Tên sản phẩm: Đàm linen phối ren.</p>
<p>- Xuất xứ: Việt Nam</p>
<p>- Đơn vị tính: cm</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<table border="1" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td style="text-align: center;" width="96">
<p><strong>Màu sắc</strong></p>
</td>
<td style="text-align: center;" width="96">
<p><strong>Size</strong></p>
</td>
<td style="text-align: center;" width="96">
<p><strong>Chất liệu</strong></p>
</td>
<td style="text-align: center;" width="96">
<p><strong>Rộng vai</strong></p>
</td>
<td style="text-align: center;" width="96">
<p><strong>Chiều dài</strong></p>
</td>
<td style="text-align: center;" width="96">
<p><strong>Co giãn</strong></p>
</td>
</tr>
<tr>
<td style="text-align: center;" width="96">
<p>Trắng kem<br> Xanh đen</p>
</td>
<td style="text-align: center;" width="96">
<p>Free size</p>
</td>
<td style="text-align: center;" width="96">
<p>Linen</p>
</td>
<td style="text-align: center;" width="96">
<p>32</p>
</td>
<td style="text-align: center;" width="96">
<p>83</p>
</td>
<td style="text-align: center;" width="96">
<p>Không</p>
</td>
</tr>
</tbody>
</table>
<p>&nbsp;</p>
<p><strong>Thông tin size người mặc:</strong></p>
<p>&nbsp;</p>
<table border="1" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td style="text-align: center;" width="104">
<p><strong>Size</strong></p>
</td>
<td style="text-align: center;" width="104">
<p><strong>Vòng ngực</strong></p>
</td>
<td style="text-align: center;" width="104">
<p><strong>Vòng eo</strong></p>
</td>
<td style="text-align: center;" width="104">
<p><strong>Vòng mông</strong></p>
</td>
</tr>
<tr>
<td style="text-align: center;" width="104">
<p>Free size</p>
</td>
<td style="text-align: center;" width="104">
<p>84-88</p>
</td>
<td style="text-align: center;" width="104">
<p>66-70</p>
</td>
<td style="text-align: center;" width="104">
<p>88-92</p>
</td>
</tr>
</tbody>
</table>
<p>&nbsp;</p>
<p><strong>Cách giặt ủi vải Linen:</strong></p>
<p>Cách giặt: Nên giặt khô hoặc giặt nước lạnh với chất tẩy nhẹ, phơi khô tự nhiên.</p>
<p>Cách ủi: Ủi khi quần áo còn ẩm hoặc xịt nước trước khi ủi. Ủi mặt trái trước, sau đó lật mặt phải ủi cho vải óng lên, đặc biệt là các loại vải linen sáng màu hoặc có hoa văn. Riêng đối với vải tối màu thì chỉ được ủi mặt trái.</p>
<p style="text-align: center;">&nbsp;</p>
<p style="text-align: center;"><img src="http://images.hotdeals.vn/hinhanh/HCM/75752_body_02.jpg" alt="Đầm Linen Phối Ren" width="600" height="1120"></p>
<p style="text-align: center;">&nbsp;</p>
<p style="text-align: center;"><img src="http://images.hotdeals.vn/hinhanh/HCM/75752_body_03.jpg" alt="Đầm Linen Phối Ren" width="600" height="2124"></p>
<p style="text-align: center;">&nbsp;</p>
<p style="text-align: center;"><img src="http://images.hotdeals.vn/hinhanh/HCM/75752_body_04.jpg" alt="Đầm Linen Phối Ren" width="600" height="1086"></p>
<p style="text-align: center;">&nbsp;</p>
<p style="text-align: center;"><img src="http://images.hotdeals.vn/hinhanh/HCM/75752_body_05.jpg" alt="Đầm Linen Phối Ren" width="600" height="1274"><em>&nbsp;</em></p>
<p style="text-align: center;"><em>Đầm linen là lựa chọn hàng đầu cho những bạn gái yêu thích phong cách nhẹ nhàng, nữ tính.</em></p>
<p style="text-align: center;">&nbsp;</p>
<p style="text-align: center;"><img src="http://images.hotdeals.vn/hinhanh/HCM/75752_body_06.jpg" alt="Đầm Linen Phối Ren" width="600" height="571"></p>
<p style="text-align: center;">&nbsp;</p>
<p style="text-align: center;"><img src="http://images.hotdeals.vn/hinhanh/HCM/75752_body_07.jpg" alt="Đầm Linen Phối Ren" width="600" height="1628"></p>
<p style="text-align: center;">&nbsp;</p>
<p style="text-align: center;"><img src="http://images.hotdeals.vn/hinhanh/HCM/75752_body_08.jpg" alt="Đầm Linen Phối Ren" width="600" height="1175"></p>
<p style="text-align: center;">&nbsp;</p>
<p style="text-align: center;"><img src="http://images.hotdeals.vn/hinhanh/HCM/75752_body_09.jpg" alt="Đầm Linen Phối Ren" width="600" height="2016"><em>&nbsp;</em></p>
<p style="text-align: center;"><em>Thiết kế đơn giản kiểu cổ thuyền, tay sát cánh, nổi bật với chi tiết phối ren tinh tế ngang eo, cho bạn gái vẻ ngoài thanh lịch, duyên dáng.</em></p>
<p style="text-align: center;">&nbsp;</p>
<p style="text-align: center;"><img src="http://images.hotdeals.vn/hinhanh/HCM/75752_body_10.jpg" alt="Đầm Linen Phối Ren" width="600" height="1145"></p>
<p style="text-align: center;">&nbsp;</p>
<p style="text-align: center;"><img src="http://images.hotdeals.vn/hinhanh/HCM/75752_body_11.jpg" alt="Đầm Linen Phối Ren" width="600" height="1379"></p>
<p style="text-align: center;">&nbsp;</p>
<p style="text-align: center;"><img src="http://images.hotdeals.vn/hinhanh/HCM/75752_body_12.jpg" alt="Đầm Linen Phối Ren" width="600" height="1230"></p>
<p style="text-align: center;">&nbsp;</p>
<p style="text-align: center;"><img src="http://images.hotdeals.vn/hinhanh/HCM/75752_body_13.jpg" alt="Đầm Linen Phối Ren" width="600" height="1163"><em>&nbsp;</em></p>
<p style="text-align: center;"><em>Form xòe nhẹ nhàng, vừa tôn lên đôi chân thon dài vừa che khuyết điểm vòng 3 hiệu quả.</em></p>
<p style="text-align: center;"><em>&nbsp;</em></p>
<p style="text-align: center;"><em><img src="http://images.hotdeals.vn/hinhanh/HCM/75752_body_14.jpg" alt="Đầm Linen Phối Ren" width="600" height="906"></em></p>
<p style="text-align: center;">&nbsp;</p>
<p style="text-align: center;"><em><img src="http://images.hotdeals.vn/hinhanh/HCM/75752_body_15.jpg" alt="Đầm Linen Phối Ren" width="600" height="1630"></em></p>
<p style="text-align: center;">&nbsp;</p>
<p style="text-align: center;"><em><img src="http://images.hotdeals.vn/hinhanh/HCM/75752_body_16.jpg" alt="Đầm Linen Phối Ren" width="600" height="2199"><br></em></p>
<p style="text-align: center;"><em>Chất liệu linen nhẹ mát, đem đến cảm giác thoải mái và tạo dáng cho chiếc đầm thêm sang trọng khi mặc.</em></p>
<p style="text-align: center;"><em>&nbsp;</em></p>
<p style="text-align: center;"><em><img src="http://images.hotdeals.vn/hinhanh/HCM/75752_body_17.jpg" alt="Đầm Linen Phối Ren" width="600" height="2131"></em></p>
<p style="text-align: center;">&nbsp;</p>
<p style="text-align: center;"><em><img src="http://images.hotdeals.vn/hinhanh/HCM/75752_body_18.jpg" alt="Đầm Linen Phối Ren" width="600" height="1313"></em></p>
<p style="text-align: center;">&nbsp;</p>
<p style="text-align: center;"><em><img src="http://images.hotdeals.vn/hinhanh/HCM/75752_body_19.jpg" alt="Đầm Linen Phối Ren" width="600" height="986"><br></em></p>
<p style="text-align: center;"><em>Dễ dàng mix cùng phụ kiện giúp bộ trang phục trở nên hoàn hảo hơn.</em></p>
<p style="text-align: center;"><em>&nbsp;</em></p>
<p><strong><em>Click MUA ngay nhé!</em></strong></p>
        </div>
        <div class="tab-pane" id="reviews">
          <div class="heading"> <span><strong>"Ladies Stylish Handbag"</strong> có 30 nhận xét và đánh giá</span>
            <div class="rating"> <i class="fa fa-star"></i> <i class="fa fa-star"></i> <i class="fa fa-star"></i> <i class="fa fa-star-half-o"></i> <i class="fa fa-star-o"></i> </div>
            <a href="#wr" class="btn color1 normal">Add Review</a> </div>
          <div class="review">
            <div class="review-info">
              <div class="name"><i class="fa fa-comment-o fa-flip-horizontal fa-fw"></i> Trần Thị Khánh Như</div>
              <div class="date"> vào <em>15/08/2014</em></div>
              <div class="rating"> <i class="fa fa-star"></i> <i class="fa fa-star"></i> <i class="fa fa-star"></i> <i class="fa fa-star-half-o"></i> <i class="fa fa-star-o"></i> </div>
            </div>
            <div class="text">Sản phẩm thật là đẹp và dễ thương, chất liệu lại cực kỳ thoáng mát, phải đặt ngay bộ này mới được, hi hi.</div>
          </div>
          <div class="review">
            <div class="review-info">
              <div class="name"><i class="fa fa-comment-o fa-flip-horizontal fa-fw"></i> Huỳnh Thanh</div>
              <div class="date"> vào <em>24/11/2014</em></div>
              <div class="rating"> <i class="fa fa-star"></i> <i class="fa fa-star"></i> <i class="fa fa-star"></i> <i class="fa fa-star-half-o"></i> <i class="fa fa-star-o"></i> </div>
            </div>
            <div class="text">Thiệt là kute quá đi,phải rinh ngay một bộ cho bạn gái mới được</div>
          </div>
          <!--span class="pull-left">Showing 1 to 2 of 123 (4 Pages)</!--span-->
          <div class="pull-right">
            <ul class="pagination pagination-xs">
              <li class="disabled"><a href="#"><i class="fa fa-angle-left"></i></a></li>
              <li  class="active"><a href="#">1</a></li>
              <li><a href="#">2</a></li>
              <li><a href="#">3</a></li>
              <li><a href="#">4</a></li>
              <li><a href="#"><i class="fa fa-angle-right"></i></a></li>
            </ul>
          </div>
          <div class="write-reivew" id="#write-review">
            <h3>Bạn đánh giá sản phẩm này như thế nào</h3>
            <div class="fr-border"></div>
            
            <!-- Form -->
            <form action="#self" id="review_form" method="post">
              <div class="row">
                <div class="col-md-4 col-xs-12"> <a name="wr"> </a>
                  <fieldset class="rating">
                    <input type="radio" id="star5" name="rating" value="5" />
                    <label for="star5" title="Rocks!" class="fa fa-star">5 stars</label>
                    <input type="radio" id="star4" name="rating" value="4" />
                    <label for="star4" title="Pretty good" class="fa fa-star">4 stars</label>
                    <input type="radio" id="star3" name="rating" value="3" />
                    <label for="star3" title="Cool" class="fa fa-star">3 stars</label>
                    <input type="radio" id="star2" name="rating" value="2" />
                    <label for="star2" title="Kinda bad" class="fa fa-star">2 stars</label>
                    <input type="radio" id="star1" name="rating" value="1" />
                    <label for="star1" title="Oops!" class="fa fa-star">1 star</label>
                  </fieldset>
                  <input type="text" id="name" placeholder="Name">
                  <input type="text" id="email" placeholder="E-mail">
                </div>
                <div class="col-md-8 col-xs-12">
                  <textarea name="" id="review" placeholder="Review" rows="8"></textarea>
                </div>
              </div>
              <button class="btn normal color1 pull-right">Submit</button>
            </form>
            <!-- end: Form --> 
          </div>
        </div>
        <div class="tab-pane" id="tags">
          <div class="tags"> <a href="#a">Free</a> <a href="#a">Minimal</a> <a href="#a">Clean</a> <a href="#a">Flatro</a> <a href="#a">Metro</a> <a href="#a">Flat</a> <a href="#a">Blue</a> <a href="#a">Fashion</a> <a href="#a">Best</a> <a href="#a">Popular</a> <a href="#a">Good</a> <a href="#a">Free</a> <a href="#a">Minimal</a> <a href="#a">Clean</a> <a href="#a">Flatro</a> <a href="#a">Metro</a> <a href="#a">Flat</a> <a href="#a">Blue</a> <a href="#a">Fashion</a> <a href="#a">Best</a> <a href="#a">Popular</a> <a href="#a">Good</a> <a href="#a">Free</a> <a href="#a">Minimal</a> <a href="#a">Clean</a> <a href="#a">Flatro</a> <a href="#a">Metro</a> <a href="#a">Flat</a> <a href="#a">Blue</a> <a href="#a">Fashion</a> <a href="#a">Best</a> <a href="#a">Popular</a> <a href="#a">Good</a> <a href="#a">Free</a> <a href="#a">Minimal</a> <a href="#a">Clean</a> <a href="#a">Flatro</a> <a href="#a">Metro</a> <a href="#a">Flat</a> <a href="#a">Blue</a> <a href="#a">Fashion</a> <a href="#a">Best</a> <a href="#a">Popular</a> <a href="#a">Good</a> <a href="#a">Free</a> <a href="#a">Minimal</a> <a href="#a">Clean</a> <a href="#a">Flatro</a> <a href="#a">Metro</a> <a href="#a">Flat</a> <a href="#a">Blue</a> <a href="#a">Fashion</a> <a href="#a">Best</a> <a href="#a">Popular</a> <a href="#a">Good</a> </div>
        </div>
        <div class="tab-pane" id="custom-tab">
          <p>Phosfluorescently productize technically sound process improvements for customized bandwidth. Competently coordinate leveraged catalysts for change without multimedia based services. Objectively fabricate user-centric experiences before.</p>
          <div class="video-wrapper">
            <div class="video-container">
              <iframe width="560" height="315" src="https://www.youtube.com/embed/keDneypw3HY" frameborder="0" allowfullscreen></iframe>
            </div>
            <!-- /video --> 
          </div>
          <!-- /video-wrapper --> 
        </div>
      </div>
      <!-- end: Tab panes --> 
      <!-- end: Details Info/Reviews/Tags -->
      <div class="clearfix f-space30"></div>
    </div>
    <!-- end: tabs --> 
    
    <!-- sidebar -->
    <div class="col-lg-3 col-md-3 col-sm-12 col-xs-12 box-block sidebar">
      <div class="box-heading"><span>Specials</span></div>
      <div class="box-content">
        <div class="box-products slide carousel-fade" id="productc2">
          <ol class="carousel-indicators">
            <li class="active" data-slide-to="0" data-target="#productc2"></li>
            <li class="" data-slide-to="1" data-target="#productc2"></li>
            <li class="" data-slide-to="2" data-target="#productc2"></li>
          </ol>
          <div class="carousel-inner"> 
            <!-- item -->
            <div class="item active">
              <div class="product-block">
                <div class="image">
                  <div class="product-label product-hot"><span>HOT</span></div>
                  <a class="img" href="Products.aspx"><img alt="product info" src="images/products/product2.jpg" title="product title"></a> </div>
                <div class="product-meta">
                  <div class="name"><a href="Products.aspx">Ladies Stylish Handbag</a></div>
                  <div class="big-price"> <span class="price-new"><span class="sym">$</span>96</span> </div>
                  <div class="big-btns"> <a class="btn btn-default btn-view pull-left" href="">View</a> <a class="btn btn-default btn-addtocart pull-right" href="">Add to
                    Cart</a> </div>
                </div>
                <div class="meta-back"></div>
              </div>
            </div>
            <!-- end: item --> 
            <!-- item -->
            <div class="item">
              <div class="product-block">
                <div class="image"> <a class="img" href="Products.aspx"><img alt="product info" src="images/products/product2.jpg" title="product title"></a> </div>
                <div class="product-meta">
                  <div class="name"><a href="Products.aspx">Ladies Stylish Handbag</a></div>
                  <div class="big-price"> <span class="price-new"><span class="sym">$</span>654.87</span> </div>
                  <div class="big-btns"> <a class="btn btn-default btn-view pull-left" href="">View</a> <a class="btn btn-default btn-addtocart pull-right" href="">Add to
                    Cart</a> </div>
                </div>
                <div class="meta-back"></div>
              </div>
            </div>
            <!-- end: item --> 
            <!-- item -->
            <div class="item">
              <div class="product-block">
                <div class="image"> <a class="img" href="Products.aspx"><img alt="product info" src="images/products/product3.jpg" title="product title"></a> </div>
                <div class="product-meta">
                  <div class="name"><a href="Products.aspx">Ladies Stylish Handbag</a></div>
                  <div class="big-price"> <span class="price-new"><span class="sym">$</span>1600</span> </div>
                  <div class="big-btns"> <a class="btn btn-default btn-view pull-left" href="">View</a> <a class="btn btn-default btn-addtocart pull-right" href="">Add to
                    Cart</a> </div>
                </div>
                <div class="meta-back"></div>
              </div>
            </div>
            <!-- end: item --> 
          </div>
        </div>
        <div class="carousel-controls"> <a class="carousel-control left" data-slide="prev" href="#productc2"> <i class="fa fa-angle-left fa-fw"></i> </a> <a class="carousel-control right" data-slide="next" href="#productc2"> <i class="fa fa-angle-right fa-fw"></i> </a> </div>
        <div class="nav-bg"></div>
      </div>
      <div class="clearfix f-space30"></div>
    </div>
    
    <!-- end: sidebar --> 
    
  </div>
  <!-- row --> 
</div>
<!-- end: container --> 

<!-- Relate Products -->

<div class="container">
  <div class="row">
    <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 main-column box-block">
      <div class="box-heading"><span>Related Products</span></div>
      <div class="box-content">
        <div class="box-products slide" id="productc3">
          <div class="carousel-controls"> <a class="carousel-control left" data-slide="prev" href="#productc3"> <i class="fa fa-angle-left fa-fw"></i> </a> <a class="carousel-control right" data-slide="next" href="#productc3"> <i class="fa fa-angle-right fa-fw"></i> </a> </div>
          <div class="carousel-inner"> 
            <!-- Items Row -->
            <div class="item active">
              <div class="row box-product"> 
                <!-- Product -->
                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                  <div class="product-block">
                    <div class="image">
                      <div class="product-label product-sale"><span>SALE</span></div>
                      <a class="img" href="Products.aspx"><img alt="product info" src="images/products/product2.jpg" title="product title"></a> </div>
                    <div class="product-meta">
                      <div class="name"><a href="Products.aspx">Ladies Stylish Handbag</a></div>
                      <div class="big-price"> <span class="price-new"><span class="sym">$</span>96</span> <span class="price-old"><span class="sym">$</span>119.50</span> </div>
                      <div class="big-btns"> <a class="btn btn-default btn-view pull-left" href="">View</a> <a class="btn btn-default btn-addtocart pull-right" href="">Add to
                        Cart</a> </div>
                      <div class="small-price"> <span class="price-new"><span class="sym">$</span>96</span> <span class="price-old"><span class="sym">$</span>119.50</span> </div>
                      <div class="rating"> <i class="fa fa-star"></i> <i class="fa fa-star"></i> <i class="fa fa-star"></i> <i class="fa fa-star-half-o"></i> <i class="fa fa-star-o"></i> </div>
                      <div class="small-btns">
                        <button class="btn btn-default btn-compare pull-left" data-toggle="tooltip" title="Add to Compare"> <i class="fa fa-retweet fa-fw"></i> </button>
                        <button class="btn btn-default btn-wishlist pull-left" data-toggle="tooltip" title="Add to Wishlist"> <i class="fa fa-heart fa-fw"></i> </button>
                        <button class="btn btn-default btn-addtocart pull-left" data-toggle="tooltip" title="Add to Cart"> <i class="fa fa-shopping-cart fa-fw"></i> </button>
                      </div>
                    </div>
                    <div class="meta-back"></div>
                  </div>
                </div>
                <!-- end: Product --> 
                <!-- Product -->
                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                  <div class="product-block">
                    <div class="image"> <a class="img" href="Products.aspx"><img alt="product info" src="images/products/product2.jpg" title="product title"></a> </div>
                    <div class="product-meta">
                      <div class="name"><a href="Products.aspx">Female Strips Handbag</a></div>
                      <div class="big-price"> <span class="price-new"><span class="sym">$</span>520</span> </div>
                      <div class="big-btns"> <a class="btn btn-default btn-view pull-left" href="">View</a> <a class="btn btn-default btn-addtocart pull-right" href="">Add to
                        Cart</a> </div>
                      <div class="small-price"> <span class="price-new"><span class="sym">$</span>520</span> </div>
                      <div class="rating"> <i class="fa fa-star"></i> <i class="fa fa-star"></i> <i class="fa fa-star"></i> <i class="fa fa-star-half-o"></i> <i class="fa fa-star-o"></i> </div>
                      <div class="small-btns">
                        <button class="btn btn-default btn-compare pull-left" data-toggle="tooltip" title="Add to Compare"> <i class="fa fa-retweet fa-fw"></i> </button>
                        <button class="btn btn-default btn-wishlist pull-left" data-toggle="tooltip" title="Add to Wishlist"> <i class="fa fa-heart fa-fw"></i> </button>
                        <button class="btn btn-default btn-addtocart pull-left" data-toggle="tooltip" title="Add to Cart"> <i class="fa fa-shopping-cart fa-fw"></i> </button>
                      </div>
                    </div>
                    <div class="meta-back"></div>
                  </div>
                </div>
                <!-- end: Product --> 
                <!-- Product -->
                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                  <div class="product-block">
                    <div class="image">
                      <div class="product-label product-new"><span>NEW</span></div>
                      <a class="img" href="Products.aspx"><img alt="product info" src="images/products/product3.jpg" title="product title"></a> </div>
                    <div class="product-meta">
                      <div class="name"><a href="Products.aspx">Blue Fashion Bag</a></div>
                      <div class="big-price"> <span class="price-new"><span class="sym">$</span>320</span> </div>
                      <div class="big-btns"> <a class="btn btn-default btn-view pull-left" href="">View</a> <a class="btn btn-default btn-addtocart pull-right" href="">Add to
                        Cart</a> </div>
                      <div class="small-price"> <span class="price-new"><span class="sym">$</span>320</span> </div>
                      <div class="rating"> <i class="fa fa-star"></i> <i class="fa fa-star"></i> <i class="fa fa-star"></i> <i class="fa fa-star-half-o"></i> <i class="fa fa-star-o"></i> </div>
                      <div class="small-btns">
                        <button class="btn btn-default btn-compare pull-left" data-toggle="tooltip" title="Add to Compare"> <i class="fa fa-retweet fa-fw"></i> </button>
                        <button class="btn btn-default btn-wishlist pull-left" data-toggle="tooltip" title="Add to Wishlist"> <i class="fa fa-heart fa-fw"></i> </button>
                        <button class="btn btn-default btn-addtocart pull-left" data-toggle="tooltip" title="Add to Cart"> <i class="fa fa-shopping-cart fa-fw"></i> </button>
                      </div>
                    </div>
                    <div class="meta-back"></div>
                  </div>
                </div>
                <!-- end: Product --> 
                <!-- Product -->
                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                  <div class="product-block">
                    <div class="image">
                      <div class="product-label product-sale"><span>SALE</span></div>
                      <a class="img" href="Products.aspx"><img alt="product info" src="images/products/product2.jpg" title="product title"></a> </div>
                    <div class="product-meta">
                      <div class="name"><a href="Products.aspx">Ladies Stylish Handbag</a></div>
                      <div class="big-price"> <span class="price-new"><span class="sym">$</span>96</span> <span class="price-old"><span class="sym">$</span>119.50</span> </div>
                      <div class="big-btns"> <a class="btn btn-default btn-view pull-left" href="">View</a> <a class="btn btn-default btn-addtocart pull-right" href="">Add to
                        Cart</a> </div>
                      <div class="small-price"> <span class="price-new"><span class="sym">$</span>96</span> <span class="price-old"><span class="sym">$</span>119.50</span> </div>
                      <div class="rating"> <i class="fa fa-star"></i> <i class="fa fa-star"></i> <i class="fa fa-star"></i> <i class="fa fa-star-half-o"></i> <i class="fa fa-star-o"></i> </div>
                      <div class="small-btns">
                        <button class="btn btn-default btn-compare pull-left" data-toggle="tooltip" title="Add to Compare"> <i class="fa fa-retweet fa-fw"></i> </button>
                        <button class="btn btn-default btn-wishlist pull-left" data-toggle="tooltip" title="Add to Wishlist"> <i class="fa fa-heart fa-fw"></i> </button>
                        <button class="btn btn-default btn-addtocart pull-left" data-toggle="tooltip" title="Add to Cart"> <i class="fa fa-shopping-cart fa-fw"></i> </button>
                      </div>
                    </div>
                    <div class="meta-back"></div>
                  </div>
                </div>
                <!-- end: Product --> 
              </div>
            </div>
            <!-- end: Items Row --> 
            <!-- Items Row -->
            <div class="item">
              <div class="row box-product"> 
                <!-- Product -->
                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                  <div class="product-block">
                    <div class="image"> <a class="img" href="Products.aspx"><img alt="product info" src="images/products/product2.jpg" title="product title"></a> </div>
                    <div class="product-meta">
                      <div class="name"><a href="Products.aspx">Female Strips Handbag</a></div>
                      <div class="big-price"> <span class="price-new"><span class="sym">$</span>520</span> </div>
                      <div class="big-btns"> <a class="btn btn-default btn-view pull-left" href="">View</a> <a class="btn btn-default btn-addtocart pull-right" href="">Add to
                        Cart</a> </div>
                      <div class="small-price"> <span class="price-new"><span class="sym">$</span>520</span> </div>
                      <div class="rating"> <i class="fa fa-star"></i> <i class="fa fa-star"></i> <i class="fa fa-star"></i> <i class="fa fa-star-half-o"></i> <i class="fa fa-star-o"></i> </div>
                      <div class="small-btns">
                        <button class="btn btn-default btn-compare pull-left" data-toggle="tooltip" title="Add to Compare"> <i class="fa fa-retweet fa-fw"></i> </button>
                        <button class="btn btn-default btn-wishlist pull-left" data-toggle="tooltip" title="Add to Wishlist"> <i class="fa fa-heart fa-fw"></i> </button>
                        <button class="btn btn-default btn-addtocart pull-left" data-toggle="tooltip" title="Add to Cart"> <i class="fa fa-shopping-cart fa-fw"></i> </button>
                      </div>
                    </div>
                    <div class="meta-back"></div>
                  </div>
                </div>
                <!-- end: Product --> 
                <!-- Product -->
                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                  <div class="product-block">
                    <div class="image">
                      <div class="product-label product-new"><span>NEW</span></div>
                      <a class="img" href="Products.aspx"><img alt="product info" src="images/products/product3.jpg" title="product title"></a> </div>
                    <div class="product-meta">
                      <div class="name"><a href="Products.aspx">Blue Fashion Bag</a></div>
                      <div class="big-price"> <span class="price-new"><span class="sym">$</span>320</span> </div>
                      <div class="big-btns"> <a class="btn btn-default btn-view pull-left" href="">View</a> <a class="btn btn-default btn-addtocart pull-right" href="">Add to
                        Cart</a> </div>
                      <div class="small-price"> <span class="price-new"><span class="sym">$</span>320</span> </div>
                      <div class="rating"> <i class="fa fa-star"></i> <i class="fa fa-star"></i> <i class="fa fa-star"></i> <i class="fa fa-star-half-o"></i> <i class="fa fa-star-o"></i> </div>
                      <div class="small-btns">
                        <button class="btn btn-default btn-compare pull-left" data-toggle="tooltip" title="Add to Compare"> <i class="fa fa-retweet fa-fw"></i> </button>
                        <button class="btn btn-default btn-wishlist pull-left" data-toggle="tooltip" title="Add to Wishlist"> <i class="fa fa-heart fa-fw"></i> </button>
                        <button class="btn btn-default btn-addtocart pull-left" data-toggle="tooltip" title="Add to Cart"> <i class="fa fa-shopping-cart fa-fw"></i> </button>
                      </div>
                    </div>
                    <div class="meta-back"></div>
                  </div>
                </div>
                <!-- end: Product --> 
                <!-- Product -->
                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                  <div class="product-block">
                    <div class="image">
                      <div class="product-label product-sale"><span>SALE</span></div>
                      <a class="img" href="Products.aspx"><img alt="product info" src="images/products/product2.jpg" title="product title"></a> </div>
                    <div class="product-meta">
                      <div class="name"><a href="Products.aspx">Ladies Stylish Handbag</a></div>
                      <div class="big-price"> <span class="price-new"><span class="sym">$</span>96</span> <span class="price-old"><span class="sym">$</span>119.50</span> </div>
                      <div class="big-btns"> <a class="btn btn-default btn-view pull-left" href="">View</a> <a class="btn btn-default btn-addtocart pull-right" href="">Add to
                        Cart</a> </div>
                      <div class="small-price"> <span class="price-new"><span class="sym">$</span>96</span> <span class="price-old"><span class="sym">$</span>119.50</span> </div>
                      <div class="rating"> <i class="fa fa-star"></i> <i class="fa fa-star"></i> <i class="fa fa-star"></i> <i class="fa fa-star-half-o"></i> <i class="fa fa-star-o"></i> </div>
                      <div class="small-btns">
                        <button class="btn btn-default btn-compare pull-left" data-toggle="tooltip" title="Add to Compare"> <i class="fa fa-retweet fa-fw"></i> </button>
                        <button class="btn btn-default btn-wishlist pull-left" data-toggle="tooltip" title="Add to Wishlist"> <i class="fa fa-heart fa-fw"></i> </button>
                        <button class="btn btn-default btn-addtocart pull-left" data-toggle="tooltip" title="Add to Cart"> <i class="fa fa-shopping-cart fa-fw"></i> </button>
                      </div>
                    </div>
                    <div class="meta-back"></div>
                  </div>
                </div>
                <!-- end: Product --> 
                <!-- Product -->
                <div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
                  <div class="product-block">
                    <div class="image">
                      <div class="product-label product-sale"><span>SALE</span></div>
                      <a class="img" href="Products.aspx"><img alt="product info" src="images/products/product2.jpg" title="product title"></a> </div>
                    <div class="product-meta">
                      <div class="name"><a href="Products.aspx">Ladies Stylish Handbag</a></div>
                      <div class="big-price"> <span class="price-new"><span class="sym">$</span>96</span> <span class="price-old"><span class="sym">$</span>119.50</span> </div>
                      <div class="big-btns"> <a class="btn btn-default btn-view pull-left" href="">View</a> <a class="btn btn-default btn-addtocart pull-right" href="">Add to
                        Cart</a> </div>
                      <div class="small-price"> <span class="price-new"><span class="sym">$</span>96</span> <span class="price-old"><span class="sym">$</span>119.50</span> </div>
                      <div class="rating"> <i class="fa fa-star"></i> <i class="fa fa-star"></i> <i class="fa fa-star"></i> <i class="fa fa-star-half-o"></i> <i class="fa fa-star-o"></i> </div>
                      <div class="small-btns">
                        <button class="btn btn-default btn-compare pull-left" data-toggle="tooltip" title="Add to Compare"> <i class="fa fa-retweet fa-fw"></i> </button>
                        <button class="btn btn-default btn-wishlist pull-left" data-toggle="tooltip" title="Add to Wishlist"> <i class="fa fa-heart fa-fw"></i> </button>
                        <button class="btn btn-default btn-addtocart pull-left" data-toggle="tooltip" title="Add to Cart"> <i class="fa fa-shopping-cart fa-fw"></i> </button>
                      </div>
                    </div>
                    <div class="meta-back"></div>
                  </div>
                </div>
                <!-- end: Product --> 
              </div>
            </div>
            <!-- end: Items Row --> 
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

<!-- end: Related products -->

<div class="row clearfix f-space30"></div>

<!-- Rectangle Banners -->

<div class="container">
  <div class="row">
    <div class="col-lg-2 col-md-2 col-sm-4 col-xs-6">
      <div class="rec-banner blue">
        <div class="banner"> <i class="fa fa-thumbs-up"></i>
          <h3>Guarantee</h3>
          <p>100% Money Back Guarantee*</p>
        </div>
      </div>
    </div>
    <div class="col-lg-2 col-md-2 col-sm-4 col-xs-6">
      <div class="rec-banner red">
        <div class="banner"> <i class="fa fa-tags"></i>
          <h3>Affordable</h3>
          <p>Convenient & affordable prices for you</p>
        </div>
      </div>
    </div>
    <div class="col-lg-2 col-md-2 col-sm-4 col-xs-6">
      <div class="rec-banner orange">
        <div class="banner"> <i class="fa fa-headphones"></i>
          <h3>24/7 Support</h3>
          <p>We support everything we sell</p>
        </div>
      </div>
    </div>
    <div class="col-lg-2 col-md-2 col-sm-4 col-xs-6">
      <div class="rec-banner lightblue">
        <div class="banner"> <i class="fa fa-female"></i>
          <h3>Summer Sale</h3>
          <p>Upto 50% off on all women wear</p>
        </div>
      </div>
    </div>
    <div class="col-lg-2 col-md-2 col-sm-4 col-xs-6">
      <div class="rec-banner darkblue">
        <div class="banner"> <i class="fa fa-gift"></i>
          <h3>Surprise Gift</h3>
          <p>Value $50 on orders over $700</p>
        </div>
      </div>
    </div>
    <div class="col-lg-2 col-md-2 col-sm-4 col-xs-6">
      <div class="rec-banner black">
        <div class="banner"> <i class="fa fa-truck"></i>
          <h3>Free Shipping</h3>
          <p>All over in world over $100</p>
        </div>
      </div>
    </div>
  </div>
</div>
<!-- end: Rectangle Banners -->

<div class="row clearfix f-space30"></div>
<script src="js/jquery.elevatezoom.js" type="text/javascript"></script> 
<script>

    (function ($) {
        "use strict";
        //Mega Menu
        $('#menuMega').menu3d();

        //Help/Contact Number/Quick Message
        $('.quickbox').carousel({
            interval: 10000
        });

        //SPECIALS
        $('#productc2').carousel({
            interval: 4000
        });
        //RELATED PRODUCTS
        $('#productc3').carousel({
            interval: 4000
        });

        //Zoom Product
        $("#product-image").elevateZoom({
            zoomType: "inner",
            cursor: "crosshair",
            easing: true,
            gallery: "thumbs",
            galleryActiveClass: "active",
            loadingIcon: true
        });
        $("#product-image").bind("click", function (e) {
            var ez = $('#product-image').data('elevateZoom');
            ez.closeAll(); //NEW: This function force hides the lens, tint and window	
            //$.fancybox(ez.getGalleryList());     
            return false;
        });
    })(jQuery);

 </script>
</asp:Content>
